<template>
  <div>
    <CloudRow>
      <CloudCol :span="12">
        <CloudSlider v-model="inputValue1" :min="1" :max="20" />
      </CloudCol>
      <CloudCol :span="4">
        <CloudInputNumber v-model="inputValue1" :min="1" :max="20" style="marginleft: 16px" />
      </CloudCol>
    </CloudRow>
    <CloudRow>
      <CloudCol :span="12">
        <CloudSlider v-model="inputValue" :min="0" :max="1" :step="0.01" />
      </CloudCol>
      <CloudCol :span="4">
        <CloudInputNumber
          v-model="inputValue"
          :min="0"
          :max="1"
          :step="0.01"
          style="marginleft: 16px"
        />
      </CloudCol>
    </CloudRow>
  </div>
</template>

<script>
  export default {
    title: '6.带输入框的滑块 ',
    subTitle: '和 数字输入框 组件保持同步。',
    data () {
      return {
        inputValue: 0,
        inputValue1: 1,
      }
    },
    methods: {
    }
  }
</script>

<style lang="scss">
  .code-box-demo .ant-slider {
    margin-bottom: 16px;
  }
</style>